<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>分类管理</title>
    <meta name="keywords" content="分类管理">
    <meta name="description" content="分类管理">
    <link rel="shortcut icon" href="favicon.ico">
    <link href="__ADMIN__/css/bootstrap.min14ed.css?v=3.3.6" rel="stylesheet">
    <link href="__ADMIN__/css/font-awesome.min93e3.css?v=4.4.0" rel="stylesheet">
    <link href="__ADMIN__/css/plugins/iCheck/custom.css" rel="stylesheet">
    <link href="__ADMIN__/css/animate.min.css" rel="stylesheet">
    <link href="__ADMIN__/css/style.min862f.css?v=4.1.0" rel="stylesheet">
    <script src="__ADMIN__/js/jquery.min.js?v=2.1.4"></script>
    <script src="__ADMIN__/js/ajaxfileupload.js"></script>
    <link href="__ADMIN__/css/admin.css" rel="stylesheet">
</head>

<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeIn">
        <div class="row">
            <div class="col-sm-12">
                <div class="tabs-container">
                    <ul class="nav nav-tabs">
                        <li class="{if condition="input('tab',1) eq 1"}active{/if}"><a data-toggle="tab" href="#tab-1" aria-expanded="true">分类列表</a></li>
                        <li class="{if condition="input('tab',1) eq 2"}active{/if}"><a data-toggle="tab" href="#tab-2" aria-expanded="false">添加新分类</a></li>
                        <li id="showtab" class="{if condition="input('tab',1) eq 3"}active{/if}"><a data-toggle="tab" href="#tab-3" style="{if condition="input('tab',1) neq 3"}display:none{/if}" aria-expanded="false">编辑分类</a></li>
                        <li id="showtab" class="{if condition="input('tab',1) eq 4"}active{/if}"><a data-toggle="tab" href="#tab-4" style="{if condition="input('tab',1) neq 4"}display:none{/if}" aria-expanded="false">规格管理</a></li>
                    </ul>
                    <div class="tab-content">
                        <div id="tab-1" class="tab-pane {if condition="input('tab',1) eq 1"}active{/if}">
                            <div class="panel-body">
                                <form method="post" class="form-horizontal" action="{:url('index')}" data-type="ajax">
                                    <div class="table-responsive">
                                        <table class="table table-striped">
                                            <thead>
                                                <tr>
                                                    <th width="10%">排序</th>
                                                    <th width="15%">分类ID</th>
                                                    <th width="25%">分类名称</th>
                                                    <th width="15%">图片</th>
                                                    <th width="10%">首页显示</th>
                                                    <th width="25%">操作</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                {volist name="lists" id="vo"}
                                                    <tr>
                                                        <td>
                                                            <input type="text" name="sort[{$vo.id}]" class="form-control" value="{$vo.sort}">
                                                        </td>
                                                        <td>{$vo.id}</td>
                                                        <td style="text-align:left">{$vo.name}</td>
                                                        <td>{if condition="$vo.img neq ''"}<img src="__UPLOADS__/{$vo.img}" alt="{$vo.name}" width="36">{/if}</td>
                                                        <td>{$vo.pid==0 ? ($vo.is_show_index ? '是' : '否') : ''}</td>
                                                        <td>
                                                            {eq name="vo.pid" value="0"}
                                                                <a href="{:url('index',['pid'=>$vo.id, 'tab'=>2])}" title="添加子分类"><i class="fa fa-plus text-navy"></i></a>&nbsp;&nbsp;
                                                            {/eq}
                                                            {neq name="vo.pid" value="0"}
                                                                <a href="{:url('index',['id'=>$vo.id, 'tab'=>4])}" title="规格管理"><i class="fa fa-puzzle-piece text-navy"></i></a>&nbsp;&nbsp;
                                                            {/neq}
                                                            <a href="{:url('index',['id'=>$vo.id, 'tab'=>3])}" title="编辑"><i class="fa fa-edit text-navy"></i></a>&nbsp;&nbsp;
                                                            <a name="delete" href="{:url('delete',['id'=>$vo.id])}" title="删除"><i class="fa fa-trash-o text-navy"></i></a>
                                                        </td>
                                                    </tr>
                                                {/volist}
                                            </tbody>
                                        </table>
                                    </div>
                                    <div class="form-group">
                                        <div class="col-sm-4 col-sm-offset-2">
                                            <button class="btn btn-primary" type="submit">提交</button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                        <div id="tab-2" class="tab-pane {if condition="input('tab',1) eq 2"}active{/if}">
                            <div class="panel-body">
                                <form method="post" class="form-horizontal" action="{:url('add')}" data-type="ajax">
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">分类名称</label>
                                        <div class="col-sm-10">
                                            <input type="text" name='name' class="form-control" value="">
                                        </div>
                                    </div>
                                    <div class="hr-line-dashed"></div>

                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">上级分类</label>
                                        <div class="col-sm-10">
                                            <select class="form-control m-b" name="pid">
                                                <option value="0" selected>≡ 作为顶级分类 ≡</option>
                                                {volist name="lists" id="vo"}
                                                    <option value="{$vo.id}" {$vo.pid ? 'disabled' : ''} {if condition="input('pid',0) eq $vo.id"}selected{/if}>{$vo.name}</option>
                                                {/volist}
                                            </select>
                                        </div>
                                    </div>
                                    <div class="hr-line-dashed"></div>

                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">分类图片</label>
                                        <div class="col-sm-10">
                                            <div id="file-pretty">
                                                <input id="file_path" name="file" type="file" class="form-control" style="display:none">
                                                <div class="input-append input-group">
                                                    <span class="input-group-btn">
                                                        <button id="btn_path" type="button" class="btn btn-white">选择图片</button>
                                                    </span>
                                                    <input id="info_path" type="text" name='img' class="form-control input-large" value="">
                                                </div>
                                            </div>
                                            <script type="text/javascript">
                                                $(function(){
                                                    $('#btn_path').click(function(){
                                                        $("#file_path").click();
                                                    });

                                                    //异步上传
                                                    $("body").delegate("#file_path", 'change', function(){
                                                        var filepath = $("input[name='file']").val();
                                                        var arr = filepath.split('.');
                                                        var ext = arr[arr.length-1];//图片后缀

                                                        if('gif|jpg|png|bmp'.indexOf(ext)>=0){
                                                            $.ajaxFileUpload({
                                                               url: '{:url('upload_image')}',
                                                               type: 'post',
                                                               data: { name: 'file' },
                                                               secureuri: false,
                                                               fileElementId: 'file_path',
                                                               dataType: 'json',
                                                               success: function (data, status) {
                                                                   $('#info_path').val(data);
                                                                   $('#info_path').focus();
                                                               },
                                                               error: function (data, status, e){
                                                                   layer.alert('上传失败');
                                                               }
                                                            });
                                                        }else{
                                                            // 清空file
                                                            $('#file_path').val('');
                                                            layer.alert('请上传合适的图片类型');
                                                        }
                                                    });
                                                });
                                            </script>
                                        </div>
                                    </div>
                                    <div class="hr-line-dashed"></div>

                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">首页显示</label>
                                        <div class="col-sm-10">
                                            <div class="radio i-checks">
                                                <label><input type="radio" value="1" name="is_show_index" checked><i></i> 是</label>
                                                <label><input type="radio" value="0" name="is_show_index"><i></i> 否</label>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="hr-line-dashed"></div>

                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">排序</label>
                                        <div class="col-sm-10">
                                            <input type="text" name='sort' class="form-control" value="">
                                        </div>
                                    </div>
                                    <div class="hr-line-dashed"></div>

                                    <div class="form-group">
                                        <div class="col-sm-4 col-sm-offset-2">
                                            <button class="btn btn-primary" type="submit">提交</button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                        <div id="tab-3" class="tab-pane {if condition="input('tab',1) eq 3"}active{/if}">
                            <div class="panel-body">
                                <form method="post" class="form-horizontal" action="{:url('edit')}" data-type="ajax">
                                    <input type="hidden" name="tab" value="3">
                                    <input type="hidden" name="id" value="{$info.id}">

                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">分类名称</label>
                                        <div class="col-sm-10">
                                            <input type="text" name='name' class="form-control" value="{$info.name}">
                                        </div>
                                    </div>
                                    <div class="hr-line-dashed"></div>

                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">上级分类</label>
                                        <div class="col-sm-10">
                                            <select class="form-control m-b" name="pid">
                                                <option value="0" selected>≡ 作为顶级分类 ≡</option>
                                                {volist name="lists" id="vo"}
                                                    <option value="{$vo.id}" {$vo.pid ? 'disabled' : ''} {$info.pid == $vo.id ? 'selected' : ''}>{$vo.name}</option>
                                                {/volist}
                                            </select>
                                        </div>
                                    </div>
                                    <div class="hr-line-dashed"></div>

                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">分类图片</label>
                                        <div class="col-sm-10">
                                            <div id="file-pretty">
                                                <input id="file_path_edit" name="file" type="file" class="form-control" style="display:none">
                                                <div class="input-append input-group">
                                                    <span class="input-group-btn">
                                                        <button id="btn_path_edit" type="button" class="btn btn-white">选择图片</button>
                                                    </span>
                                                    <input id="info_path_edit" type="text" name='img' class="form-control input-large" value="{$info.img}">
                                                </div>
                                            </div>
                                            <script type="text/javascript">
                                                $(function(){
                                                    $('#btn_path_edit').click(function(){
                                                        $("#file_path_edit").click();
                                                    });

                                                    //异步上传
                                                    $("body").delegate("#file_path_edit", 'change', function(){
                                                        var filepath = $("input[name='file']").val();
                                                        var arr = filepath.split('.');
                                                        var ext = arr[arr.length-1];//图片后缀

                                                        if('gif|jpg|png|bmp'.indexOf(ext)>=0){
                                                            $.ajaxFileUpload({
                                                               url: '{:url('upload_image')}',
                                                               type: 'post',
                                                               data: { name: 'file' },
                                                               secureuri: false,
                                                               fileElementId: 'file_path_edit',
                                                               dataType: 'json',
                                                               success: function (data, status) {
                                                                   $('#info_path_edit').val(data);
                                                                   $('#info_path_edit').focus();
                                                               },
                                                               error: function (data, status, e){
                                                                   layer.alert('上传失败');
                                                               }
                                                            });
                                                        }else{
                                                            // 清空file
                                                            $('#file_path_edit').val('');
                                                            layer.alert('请上传合适的图片类型');
                                                        }
                                                    });
                                                });
                                            </script>
                                        </div>
                                    </div>
                                    <div class="hr-line-dashed"></div>

                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">首页显示</label>
                                        <div class="col-sm-10">
                                            <div class="radio i-checks">
                                                <label><input type="radio" value="1" name="is_show_index" {$info.is_show_index ? 'checked' : ''}><i></i> 是</label>
                                                <label><input type="radio" value="0" name="is_show_index" {$info.is_show_index ? '' : 'checked'}><i></i> 否</label>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="hr-line-dashed"></div>

                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">排序</label>
                                        <div class="col-sm-10">
                                            <input type="text" name='sort' class="form-control" value="{$info.sort}">
                                        </div>
                                    </div>
                                    <div class="hr-line-dashed"></div>

                                    <div class="form-group">
                                        <div class="col-sm-4 col-sm-offset-2">
                                            <button class="btn btn-primary" type="submit">提交</button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                        <div id="tab-4" class="tab-pane {if condition="input('tab',1) eq 4"}active{/if}">
                            <div class="panel-body">
                                <form method="post" class="form-horizontal" action="{:url('spec_edit')}" data-type="ajax">
                                    <input type="hidden" name="tab" value="4">
                                    <input type="hidden" name="cid" value="{:input('id',0)}">

                                    <div class="form-group">
                                        <label class="col-sm-5 control-label" style="text-align:center">排序</label>
                                        <label class="col-sm-5 control-label" style="text-align:center">规格</label>
                                        <label class="col-sm-2 control-label" style="text-align:center">操作</label>
                                    </div>
                                    <div class="hr-line-dashed"></div>

                                    {volist name="spec" id="vo"}
                                        <div class="form-group">
                                            <div class="col-sm-5">
                                                <input type="text" name='sort[{$vo.id}]' class="form-control" value="{$vo.sort}">
                                            </div>
                                            <div class="col-sm-5">
                                                <input type="text" name='name[{$vo.id}]' class="form-control" value="{$vo.name}">
                                            </div>
                                            <div class="col-sm-2" style="text-align:center">
                                                <a name="delete" href="{:url('spec_delete',['id'=>$vo.id,'cid'=>$vo.cid])}" title="删除"><i class="fa fa-trash-o text-navy"></i></a>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                    {/volist}
                                    <div id="spec_item"></div>

                                    <div class="form-group">
                                        <div class="col-sm-4 col-sm-offset-2">
                                            <button class="btn btn-primary" type="button" id="btn_add_spec">添加规格</button>&nbsp;&nbsp;&nbsp;&nbsp;
                                            <button class="btn btn-primary" type="submit">提交</button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        $(document).on('click','#btn_add_spec',function(){
            var str = '<div class="form-group">'+
                            '<div class="col-sm-5">'+
                                '<input type="text" name="sortnew[]" class="form-control">'+
                            '</div>'+
                            '<div class="col-sm-5">'+
                                '<input type="text" name="namenew[]" class="form-control">'+
                            '</div>'+
                            '<div class="col-sm-2" style="text-align:center">'+
                                '<a href="javascript:;" class="delete_item" title="删除"><i class="fa fa-trash-o text-navy"></i></a>'+
                            '</div>'+
                        '</div>'+
                        '<div class="hr-line-dashed"></div>';
            $('#spec_item').append(str);
        });

        $(document).on('click','.delete_item',function(){
            $(this).parent().parent().next().remove();
            $(this).parent().parent().remove();
        });
    </script>
    <script src="__ADMIN__/js/bootstrap.min.js?v=3.3.6"></script>
    <script src="__ADMIN__/js/content.min.js?v=1.0.0"></script>
    <script src="__ADMIN__/js/plugins/iCheck/icheck.min.js"></script>
    <script src="__ADMIN__/js/plugins/layer/layer.min.js"></script>
    <script src="__ADMIN__/js/layer_hplus.js"></script>
    <script src="__ADMIN__/js/plugins/prettyfile/bootstrap-prettyfile.js"></script>
    <script src="__ADMIN__/js/plugins/cropper/cropper.min.js"></script>
    <script src="__ADMIN__/js/demo/form-advanced-demo.min.js"></script>
    <script src="__ADMIN__/js/plugins/layer/laydate/laydate.js"></script>
</body>

</html>
